<template>
	<div class="aplicationCenter">
		<el-card class="box-card">
			<div slot="header" class="clearfix">
				<span>账号信息</span>
			</div>
			<div>
				<el-form ref="form">
					<template v-if="host.onoffPwd">
						<el-form-item label="新密码">
							<div class="lz-el-col">
								<el-input v-model="host.dest " type="password" :disabled="host.disabled" size="mini" style="width: 220px;"
								 placeholder="请输入新密码"></el-input>
							</div>
						</el-form-item>
						<el-form-item label="原密码">
							<div class="lz-el-col">
								<el-input v-model="host.src " type="password" :disabled="host.disabled" size="mini" style="width: 220px;"
								 placeholder="请输入原密码"></el-input>
							</div>
						</el-form-item>
					</template>

					<el-form-item>
						<el-button type="primary" size="mini" @click="host.disabled=false" v-if="host.disabled">修改</el-button>
						<template v-else>
							<el-button type="primary" size="mini" @click="hostUpdate">确认</el-button>
							<el-button type="success" size="mini" @click="host.disabled=true">取消</el-button>
						</template>
					</el-form-item>
				</el-form>
			</div>
		</el-card>
		<el-card class="box-card">
			<div slot="header" class="clearfix">
				<div class="seach-warp">
					<div>应用信息</div>
					<div style="flex: 1;margin-left: 80px;" class="seach-warp">
						<div class="warp-left">
							<el-button type="primary" size="mini" icon="el-icon-plus" @click="modifyAdd">添加</el-button>
						</div>
						<div class="warp-right">
							<el-input placeholder="请输入编号" prefix-icon="el-icon-search" v-model="seach.value" size="mini"></el-input>
							<el-button type="primary" size="mini" icon="el-icon-search" style="margin-left: 10px;" @click="getListdata">搜索</el-button>
						</div>
					</div>
				</div>
			</div>
			<div>
				<el-table :data="tableData" style="width: 100%" size="mini" :header-cell-style="{background: '#F9F9F9'}" border
				 stripe highlight-current-row>
					<el-table-column prop="createDate" label="创建日期" width="140" align="center"></el-table-column>
					<el-table-column prop="flag" label="主应用" align="center" show-overflow-tooltip>
						<template slot-scope="scope">
							{{scope.row.flag}}
						</template>
					</el-table-column>
					<el-table-column prop="name" label="应用名称" align="center" show-overflow-tooltip></el-table-column>
					<el-table-column prop="accessKey" label="应用key" align="center" show-overflow-tooltip></el-table-column>
					<el-table-column prop="accessSecret" label="应用秘钥" align="center" show-overflow-tooltip></el-table-column>
					<el-table-column label="回调接口" align="center">
						<el-table-column prop="callbackDeviceRegUrl" label="设备注册" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackFingerChangeUrl" label="指纹变更" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackSealInfoUrl" label="用印记录" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackSealImageUrl" label="用印图片" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackDeviceInfoUrl" label="设备详情" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackApplicationUrl" label="申请单相关" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackFileTokenUrl" label="图片访问授权" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackWifiListUrl" label="wifi列表" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackNetworkChangeUrl" label="网络变更" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackSleepChangeUrl" label="休眠变更" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackModelChangeUrl" label="运行模式变更" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackIdUnlockUrl" label="无指纹用印" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackDeviceInitUrl" label="设备初始化" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackDeviceLockUrl" label="设备锁相关" width="100" align="center" show-overflow-tooltip></el-table-column>
						<el-table-column prop="callbackOfflineApplicationUrl" label="离线申请单" width="100" align="center"
						 show-overflow-tooltip></el-table-column>
					</el-table-column>
					<el-table-column fixed="right" label="操作" width="240" align="center">
						<template slot-scope="scope">
							<el-button type="primary" size="mini" plain @click="modifyEdit(scope.row)">修改</el-button>
							<el-button type="danger" size="mini" plain @click="deleteFile(scope.row)">删除</el-button>
							<el-button type="warning" size="mini" plain @click="logDataFn(scope.row)">日志</el-button>
							<!-- <el-button type="warning" size="mini" plain @click="webSocketFn(scope.row)">webSocket</el-button> -->
						</template>
					</el-table-column>
				</el-table>
				<div style="overflow: hidden;">
					<div style="float: right;margin-top: 20px;">
						<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page.pageNum"
						 :page-sizes="[10, 20, 30, 40]" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper"
						 :total="page.total">
						</el-pagination>
					</div>
				</div>
				<el-dialog :title="app.title" :visible.sync="app.dialogTableVisible" center width="750px">
					<el-form ref="form" label-width="100px" :rules="rules" :model="app">
						<el-form-item label="主应用">
							<div class="lz-el-col" style="margin-top: 10px;">
								<el-switch v-model="app.flag" active-text="是" inactive-text="否">
								</el-switch>
							</div>
						</el-form-item>
						<el-row>
							<el-col :span="12">
								<el-form-item label="应用名称" prop="name">
									<div class="lz-el-col">
										<el-input v-model="app.name " size="mini" style="width: 220px;" placeholder="请输入应用名称"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="应用账号" prop="appAccessKey">
									<div class="lz-el-col">
										<el-input v-model="app.appAccessKey " size="mini" style="width: 220px;" placeholder="请输入应用KEY"></el-input>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="组织ID" prop="orgId">
									<div class="lz-el-col" style="align-items: center;">
										<el-input v-model="app.orgId " size="mini" style="width: 220px;" placeholder="请输入组织ID"></el-input>
										<el-tooltip effect="dark" placement="top-start">
											<div slot="content">提示信息：默认组织ID仅对新注册设备有效，已注册过的设备如需更改组织ID，<br/>请使用'设备初始化'功能，如果业务端为单租户系统，该值可随意填写</div>
											<div class="el-icon-info"></div>
										</el-tooltip>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="通讯秘钥">
									<div class="lz-el-col" style="position: relative;">
										<el-input v-model="app.appAccessSecret " size="mini" style="width: 220px;" placeholder="请输入应用秘钥"></el-input>
										<el-tooltip style="position: absolute;right: 30px;top: 5px;"  class="coltext" effect="dark" content="随机生成" placement="top-start">
											<el-button icon="el-icon-edit-outline" circle @click="randomGen" plain size="mini"></el-button>
										</el-tooltip>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-divider content-position="left">
							<div style="color: red;font-weight: bold;">回调接口</div>
						</el-divider>
						<el-row>
							<el-col :span="12">
								<el-form-item label="设备注册" prop="callbackDeviceRegUrl">
									<div class="lz-el-col">
										<el-input v-model="app.callbackDeviceRegUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="指纹变更" prop="callbackFingerChangeUrl">
									<div class="lz-el-col">
										<el-input v-model="app.callbackFingerChangeUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="用印记录" prop="callbackSealInfoUrl">
									<div class="lz-el-col">
										<el-input v-model="app.callbackSealInfoUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="用印图片" prop="callbackSealImageUrl">
									<div class="lz-el-col">
										<el-input v-model="app.callbackSealImageUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="设备详情" prop="callbackDeviceInfoUrl">
									<div class="lz-el-col">
										<el-input v-model="app.callbackDeviceInfoUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="休眠变更">
									<div class="lz-el-col">
										<el-input v-model="app.callbackSleepChangeUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="网络变更">
									<div class="lz-el-col">
										<el-input v-model="app.callbackNetworkChangeUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="wifi列表">
									<div class="lz-el-col">
										<el-input v-model="app.callbackWifiListUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="设备锁相关">
									<div class="lz-el-col">
										<el-input v-model="app.callbackDeviceLockUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="设备初始化">
									<div class="lz-el-col">
										<el-input v-model="app.callbackDeviceInitUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="申请单相关">
									<div class="lz-el-col">
										<el-input v-model="app.callbackApplicationUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>

							</el-col>
							<el-col :span="12">
								<el-form-item label="无指纹用印">
									<div class="lz-el-col">
										<el-input v-model="app.callbackIdUnlockUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="运行模式变更">
									<div class="lz-el-col">
										<el-input v-model="app.callbackModelChangeUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="图片访问授权">
									<div class="lz-el-col">
										<el-input v-model="app.callbackFileTokenUrl " size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>

							</el-col>
						</el-row>
						<el-row>
							<el-col :span="12">
								<el-form-item label="离线申请单">
									<div class="lz-el-col">
										<el-input v-model="app.callbackOfflineApplicationUrl" size="mini" style="width: 220px;" placeholder="请输入回调接口"></el-input>
									</div>
								</el-form-item>
							</el-col>
							<el-col :span="12">
							</el-col>
						</el-row>

					</el-form>
					<div slot="footer" class="dialog-footer">
						<el-button type="primary" size="mini" @click="appUpdate">确认</el-button>
						<el-button type="success" size="mini" @click="app.dialogTableVisible=false">取消</el-button>
					</div>
				</el-dialog>
				<!-- 日志 -->
				<el-dialog title="日志" :visible.sync="log.input_fingerprint_onoff" width="950px" center>
					<div style="overflow: hidden;">
						<el-form ref="form" label-width="90px" style="display: flex;flex-wrap: wrap;">
							<el-form-item label="协议号" :span="6" style="width: 240px;">
								<el-select v-model="log.seach.cmd" clearable size="mini" placeholder="请选择">
									<el-option :label="item.value" :value="item.id" v-for="(item,index) in log.Cmds" :key="index"></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="请求状态" :span="6" style="width: 240px;">
								<el-select v-model="log.seach.status" clearable size="mini" placeholder="请选择">
									<el-option label="成功" :value="0"></el-option>
									<el-option label="失败" :value="1"></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="请求类型" :span="6" style="width: 240px;">
								<el-select v-model="log.seach.type" clearable size="mini" placeholder="请选择">
									<el-option label="系统回调" :value="0"></el-option>
									<el-option label="业务请求" :value="1"></el-option>
								</el-select>
							</el-form-item>
							<el-form-item style="width: 100px;" label-width="40px">
								<el-button type="primary" size="mini" icon="el-icon-search" plain @click="logseachInput">搜索</el-button>
							</el-form-item>
						</el-form>
						<el-table :data="log.tableData" size="mini" border>
							<el-table-column property="createDate" label="日期" width="180" align="center"></el-table-column>
							<el-table-column property="cmd" label="协议号" align="center" :show-overflow-tooltip="true">
								<template slot-scope="scope">
									<el-tag size="mini" type="success" plain>{{computeCmd(scope.row.cmd)}}</el-tag>
								</template>
							</el-table-column>
							<el-table-column property="params" label="请求参数" align="center" :show-overflow-tooltip="true">
								<template slot-scope="scope">
									<div>{{scope.row.params}}</div>
									<el-tag size="mini" type="danger" plain style="cursor: pointer;" @click="handleCopy(scope.row.params)">一键复制</el-tag>
								</template>
							</el-table-column>
							<el-table-column property="type" label="请求类型" align="center" :show-overflow-tooltip="true">
								<template slot-scope="scope">
									<el-tag size="mini" type="success" plain v-if="scope.row.type==1">业务请求</el-tag>
									<el-tag size="mini" type="success" plain v-if="scope.row.type==0">系统回调</el-tag>
								</template>
							</el-table-column>
							<el-table-column property="status" label="请求状态" align="center" :show-overflow-tooltip="true">
								<template slot-scope="scope">
									<el-tag size="mini" type="warning" plain v-if="scope.row.status==true">成功</el-tag>
									<el-tag size="mini" type="" plain v-if="scope.row.status==false">失败</el-tag>
								</template>
							</el-table-column>
							<el-table-column property="url" label="目标url" align="center" :show-overflow-tooltip="true"></el-table-column>
						</el-table>
						<!-- //分页 -->
						<el-pagination class="lz-el-pagination" @current-change="logCurrentChange" @size-change="logSizeChange"
						 :current-page="log.page.pageNum" :page-sizes="[10,20,30]" :page-size="log.page.pageSize" layout="total, sizes, prev, pager, next, jumper"
						 :total="log.page.total"></el-pagination>
					</div>
				</el-dialog>

			</div>
		</el-card>
	</div>
</template>

<script>
	let that = ''
	//非父子组件传值
	import bus from '../../../../static/js/bus.js';
	import {
		mapActions,
		mapGetters
	} from 'vuex';
	export default {
		computed: {
			...mapGetters(['userInfo', 'api']), //获取
			computeCmd() {
				return (cmd) => {
					let arr = that.log.Cmds.filter((item) => {
						return item.id == cmd
					})
					return arr[0].value
				}
			}
		},
		components: {},
		data() {
			return {
				//账号信息
				host: {
					onoffPwd: true,
					disabled: true,
					remoteHosts: "", //远程登录IP列表,分割
					dest: '', //新密码
					src: '', //旧密码
				},
				//修改应用中心
				app: {
					flag: false, //是否主应用
					title: '修改应用信息',
					name: '',
					type: 'edit', //默认修改edit add为添加
					dialogTableVisible: false,
					appAccessKey: '', //应用ID
					appAccessSecret: '', //应用秘钥
					orgId:'',//组织id
					callbackApplicationUrl: "",
					callbackDeviceInfoUrl: "",
					callbackDeviceInitUrl: "",
					callbackDeviceLockUrl: "",
					callbackDeviceRegUrl: "",
					callbackFileTokenUrl: "",
					callbackFingerChangeUrl: "",
					callbackIdUnlockUrl: "",
					callbackModelChangeUrl: "",
					callbackNetworkChangeUrl: "",
					callbackOfflineApplicationUrl: "",
					callbackSealImageUrl: "",
					callbackSealInfoUrl: "",
					callbackSleepChangeUrl: "",
					callbackWifiListUrl: "",
				},
				seach: {
					value: '', //搜索
				},
				tableData: [],
				page: { //分页
					pageSize: 10, //每页多少条
					pageNum: 0, //当前页
					total: 0, //总页数
				},
				rules: {
					name: [{
						required: true,
						message: '请输入应用名称',
						trigger: 'blur'
					}],
					appAccessKey: [{
						required: true,
						message: '请输入应用账号',
						trigger: 'blur'
					}],
					orgId: [{
						required: true,
						message: '请输入组织ID',
						trigger: 'blur'
					}],
					callbackDeviceRegUrl: [{
						required: true,
						message: '请输入设备注册',
						trigger: 'blur'
					}],
					callbackFingerChangeUrl: [{
						required: true,
						message: '请输入指纹变更',
						trigger: 'blur'
					}],
					callbackSealInfoUrl: [{
						required: true,
						message: '请输入用印记录',
						trigger: 'blur'
					}],
					callbackSealImageUrl: [{
						required: true,
						message: '请输入用印图片',
						trigger: 'blur'
					}],
					callbackDeviceInfoUrl: [{
						required: true,
						message: '请输入设备详情',
						trigger: 'blur'
					}],
				},
				//日志
				log: {
					input_fingerprint_onoff: false,
					tableData: [],
					Cmds: [], //协议和
					page: { //分页
						pageNum: 1, //当前页数
						pageSize: 10, //默认一页展示10条
						total: 0, //总条数
					},
					seach: { //搜索
						cmd: '',
						status: '',
						type: '',
					}
				}
			}
		},
		mounted() {
			that = this
			//查询app信息
			that.getListdata()
			//获取协议和
			that.getCmds()
		},
		methods: {
			//websocket
			webSocketFn(row){
				console.log(row);
				that.$lizhao.websocket.send(row.id)
				that.$router.push({name:'webSocket'})
			},
			//随机生成
			randomGen() {
				let str = that.randomString(16)
				that.app.appAccessSecret = str
				console.log(str);
			},
			randomString(len = 32) {
				let $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'; /****默认去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1****/
				let maxPos = $chars.length;
				let pwd = '';
				for (let i = 0; i < len; i++) {
					pwd += $chars.charAt(Math.floor(Math.random() * maxPos));
				}
				return pwd;
			},
			//修改账号信息
			hostUpdate() {
				if (that.host.onoffPwd) { //修改密码
					let req = {
						dest: that.host.dest,
						src: that.host.src
					}
					that.GLOBAL.doPost(that.api.GLOBAL_account_changePwd, req).then(res => {
						if (res.code == 0) {
							that.$message({
								message: res.message,
								type: 'success'
							});
						}
					})
				} else {
					that.GLOBAL.doPost(that.api.GLOBAL_account_updateRemoteHost, {
						remoteHosts: that.host.remoteHosts
					}).then(res => {
						if (res.code == 0) {
							that.$message({
								message: res.message,
								type: 'success'
							});
						}
					})
				}


			},

			//查询app信息
			getListdata() {
				let req = {
					pageSize: that.page.pageSize,
					pageNum: that.page.pageNum,
				}
				that.GLOBAL.doGet(that.api.GLOBAL_app_get, req).then(res => {
					if (res.code == 0 && res.data) {
						that.tableData = res.data.list
						that.page.total = res.total
					} else {
						that.tableData = []
						that.page.total = 0
					}
				})
			},
			//点击修改
			modifyEdit(row) {
				console.log(row);
				that.app = {
					...row,
					flag: row.flag,
					title: '修改应用信息',
					type: 'edit', //默认修改edit add为添加
					dialogTableVisible: true,
					name: row.name,
					appAccessKey: row.accessKey,
					appAccessSecret: row.accessSecret,
					id: row.id,
				}
			},
			//添加
			modifyAdd() {
				that.app = {
					flag: false,
					title: '添加应用信息',
					type: 'add', //默认修改edit add为添加
					dialogTableVisible: true,
					name: '',
					appAccessKey: '',
					appAccessSecret: '',
					callbackApplicationUrl: "",
					callbackDeviceInfoUrl: "",
					callbackDeviceInitUrl: "",
					callbackDeviceLockUrl: "",
					callbackDeviceRegUrl: "",
					callbackFileTokenUrl: "",
					callbackFingerChangeUrl: "",
					callbackIdUnlockUrl: "",
					callbackModelChangeUrl: "",
					callbackNetworkChangeUrl: "",
					callbackOfflineApplicationUrl: "",
					callbackSealImageUrl: "",
					callbackSealInfoUrl: "",
					callbackSleepChangeUrl: "",
					callbackWifiListUrl: "",
				}
			},
			//更新应用基础信息
			appUpdate() {
				this.$refs.form.validate((valid) => {
					if (valid) {
						if (that.app.type == 'edit') {
							that.GLOBAL.doPost(that.api.GLOBAL_app_update, that.app).then(res => {
								if (res.code == 0) {
									that.$message({
										message: '更新成功',
										type: 'success'
									});
									that.app.dialogTableVisible = false
									//查询app信息
									that.getListdata()
								}
							})
						} else {
							that.GLOBAL.doPost(that.api.GLOBAL_app_add, that.app).then(res => {
								if (res.code == 0) {
									that.$message({
										message: '添加成功',
										type: 'success'
									});
									that.app.dialogTableVisible = false
									//查询app信息
									that.getListdata()
								}
							})
						}
					} else {
						console.log('error submit!!');
						return false;
					}
				});




			},
			//删除文件
			deleteFile(row) {
				that.$confirm('此操作将永久删除该选项, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					const loading = that.$loading({
						lock: true,
						text: '删除中',
						spinner: 'el-icon-loading',
						background: 'rgba(0, 0, 0, 0.7)'
					});
					that.GLOBAL.doPost(that.api.GLOBAL_app_delete, {
						id: row.id
					}).then(res => {
						if (res.code == 0) {
							that.$message({
								message: '删除成功',
								type: 'success'
							});
							//查询app信息
							that.getListdata()
						}
						loading.close();
					})

				}).catch(() => {

				});

			},
			//点击日志
			logDataFn(row) {
				console.log(row);
				that.log.input_fingerprint_onoff = true
				that.log.appId = row.id

				//获取日志数据
				that.getUsageRecordFn()
			},
			//获取协议和
			getCmds() {
				that.GLOBAL.doGet(that.api.GLOBAL_log_cmds, {}).then(res => {
					if (res.code == 0 && res.data) {
						let {
							keys,
							values,
							entries
						} = Object
						let arr = []
						for (let [keys, values] of entries(res.data)) {
							let item = {
								id: keys,
								value: values
							}
							arr.push(item)
						}
						that.log.Cmds = arr
					}
				})
			},
			//搜索日志
			logseachInput() {
				that.log.page.pageNum = 1
				//获取日志数据
				that.getUsageRecordFn()
			},
			//获取日志数据
			getUsageRecordFn() {
				let req = {
					...that.log.seach,
					appId: that.log.appId,
					pageSize: that.log.page.pageSize,
					pageNum: that.log.page.pageNum,
				}
				that.GLOBAL.doGet(that.api.GLOBAL_log_list, req).then(res => {
					if (res.code == 0 && res.data) {
						that.log.tableData = res.data.list
						that.log.page.total = res.data.total
					} else {
						that.log.tableData = []
						that.log.page.total = 0
					}
				})
			},
			//日志分页
			logCurrentChange(val) {
				console.log(`当前页: ${val}`);
				that.log.page.pageNum = val;
				//获取日志数据
				that.getUsageRecordFn()
			},
			//选择一页多少条
			logSizeChange(val) {
				console.log(`每页 ${val} 条`);
				that.log.page.pageSize = val;
				//获取日志数据
				that.getUsageRecordFn()
			},
			//改变每页多少条
			handleSizeChange(val) {
				console.log(`每页 ${val} 条`);
				that.page.pageSize = val
				//获取列表
				that.getListdata()
			},
			handleCurrentChange(val) {
				console.log(`当前页: ${val}`);
				that.page.pageNum = val
				//获取列表
				that.getListdata()
			},
			//data为复制的值
			handleCopy(data) {
				let url = data;
				let oInput = document.createElement('input');
				oInput.value = url;
				document.body.appendChild(oInput);
				oInput.select(); // 选择对象;
				console.log(oInput.value)
				document.execCommand("Copy"); // 执行浏览器复制命令
				this.$message({
					message: '复制成功',
					type: 'success'
				});
				oInput.remove()
			},
		}
	}
</script>

<style scoped="scoped" lang="scss">
	.aplicationCenter {
		.box-card {
			margin-bottom: 10px;

			.lz-el-col {
				display: flex;

				.coltext {
					margin-left: 10px;
					color: #3884ff;
					cursor: pointer;
				}
			}

			/* 搜索 */
			.seach-warp {
				display: flex;
				justify-content: space-between;
				align-items: center;
			}

			.seach-warp .warp-right {
				display: flex;
			}
			.lz-el-pagination {
				margin-top: 20px;
				float: right;
			}
		}
	}
</style>
